<template>
  <div>
    <div id="pmsg">
      <div style="line-height: 15px"><h4>商品预售许可证登记表</h4></div>
      <el-divider></el-divider>
      <el-form :model="proForm" size="small" label-width="120px">
        <el-row type="flex" justify="start" align="top">
          <el-col :span="6"> </el-col>
          <el-col :span="6"> </el-col>
          <el-col :span="6">
            <el-form-item label="照片:">
              <img src="https://s1.ax1x.com/2022/12/15/zoHMq0.png" width="100px"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="申请人基本信息 :"></el-form-item>
        <el-row type="flex" justify="start" align="top" :gutter="50">
          <el-col :span="6">
            <el-form-item label="申请人 :" prop="proposerName">
              <el-input
                v-model="proForm.proposerName"
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="9">
            <el-form-item label="户籍地址 :" prop="proposerAddress">
              <el-input
                v-model="proForm.proposerAddress"
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" justify="start" align="top" :gutter="50">
          <el-col :span="6">
            <el-form-item label="联系电话 :" prop="proposerPhone">
              <el-input
                v-model="proForm.proposerPhone"
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="证件号码 :" prop="proposerCard">
              <el-input
                v-model="proForm.proposerCard"
                placeholder="请输入证件号码"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" justify="start" align="top" :gutter="50">
          <el-col :span="6">
            <el-form-item label="代理人 :" prop="proxyName">
              <el-input
                v-model="proForm.proxyName"
                placeholder="请输入代理人"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="证件号码 :" prop="proxyCard">
              <el-input
                v-model="proForm.proxyCard"
                placeholder="请输入证件号码"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>

      <el-divider></el-divider>
      <el-form :model="houseForm" size="small" label-width="120px">
        <el-form-item label="楼盘基本信息 :"></el-form-item>
        <el-row type="flex" justify="start" align="top">
          <el-col :span="6">
            <el-form-item label="建设单位:" prop="higherUnit">
              <el-input
                v-model="houseForm.higherUnit"
                placeholder="请输入建设单位"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="项目名称 :" prop="higherName">
              <el-input
                v-model="houseForm.higherName"
                placeholder="请输入项目名称"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="土地用途 :" prop="higherLandUse">
              <el-input
                v-model="houseForm.higherLandUse"
                placeholder="请输入土地用途"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row type="flex" justify="start" align="top">
          <el-col :span="6">
            <el-form-item label="土地权属 :" prop="higherLandProperty">
              <el-input
                v-model="houseForm.higherLandProperty"
                placeholder="请输入土地权属"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="房屋性质 :" prop="higherRoomType">
              <el-input
                v-model="houseForm.higherRoomType"
                placeholder="请输入房屋性质"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="设计用途 :" prop="higherSpaces">
              <el-input
                v-model="houseForm.higherSpaces"
                placeholder="请输入设计用途"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex" justify="start" align="top">
          <el-col :span="6">
            <el-form-item label="区/县 :" prop="higherDistrict">
              <el-input
                v-model="houseForm.higherDistrict"
                placeholder=""
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="建筑区划 :" prop="higherZoning">
              <el-input
                v-model="houseForm.higherZoning"
                placeholder="请输入分户图"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="丘地号 :" prop="higherMound">
              <el-input
                v-model="houseForm.higherMound"
                placeholder="请输入分户图"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row type="flex" justify="start" align="top">
          <el-col :span="6">
            <el-form-item label="土地证号 :" prop="higherLandCardno">
              <el-input
                v-model="houseForm.higherLandCardno"
                placeholder=""
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="房屋结构 :" prop="higherBuildingStructure">
              <el-input
                v-model="houseForm.higherBuildingStructure"
                placeholder="请输入分户图"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="取得方式 :" prop="higherSrcid">
              <el-input
                v-model="houseForm.higherSrcid"
                placeholder="请输入分户图"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row type="flex" justify="start" align="top">
          <el-col :span="6">
            <el-form-item label="房屋坐落 :" prop="higherRoomRepose">
              <el-input
                v-model="houseForm.higherRoomRepose"
                placeholder=""
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="土地性质 :" prop="higherLandNature">
              <el-input
                v-model="houseForm.higherLandNature"
                placeholder="请输入分户图"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="土地使用年限 :" prop="higherUseyear">
              <el-input
                v-model="houseForm.higherUseyear"
                placeholder="请输入分户图"
                clearable
                :style="{ width: '100%' }"
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>

      <el-divider></el-divider>
      <el-form :model="filesForm" size="small" label-width="120px">
        <el-form-item label="申请交验证件 :" size="50px"></el-form-item>
        <el-row>
          <el-col :span="8">
            <el-form-item label="预售申请书一份 :"> </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="未选择文件" prop="licenceApplication">
              <el-button
                type="primary"
                icon="el-icon-picture-outline"
                size="medium"
              >
                选择文件
              </el-button>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8">
            <el-form-item
              label="项目负责人身份证明 :"
              prop="licenceIdentification"
            >
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="未选择文件" prop="field134">
              <el-button
                type="primary"
                icon="el-icon-picture-outline"
                size="medium"
              >
                选择文件
              </el-button>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8">
            <el-form-item label="土地使用权证 :" prop="licenceLurc">
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="未选择文件" prop="field134">
              <el-button
                type="primary"
                icon="el-icon-picture-outline"
                size="medium"
              >
                选择文件
              </el-button>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8">
            <el-form-item label="建设用地规划许可证 :" prop="licenceLup">
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="未选择文件" prop="field134">
              <el-button
                type="primary"
                icon="el-icon-picture-outline"
                size="medium"
              >
                选择文件
              </el-button>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8">
            <el-form-item label="建设工程规划许可证 :" prop="licencePpoce">
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="未选择文件" prop="field134">
              <el-button
                type="primary"
                icon="el-icon-picture-outline"
                size="medium"
              >
                选择文件
              </el-button>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="8">
            <el-form-item label="施工许可证 :" prop="licenceXkz">
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="未选择文件" prop="field134">
              <el-button
                type="primary"
                icon="el-icon-picture-outline"
                size="medium"
              >
                选择文件
              </el-button>
            </el-form-item>
          </el-col>
        </el-row>
        <el-upload
        action="presell-serv/upload"
        :on-preview="handlePreview"
        multiple
        :limit="10"
        accept=".pdf">
        <el-button size="medium" type="primary" icon="el-icon-picture-outline">点击上传</el-button>
        <div slot="tip" class="el-upload__tip">只能上传pdf文件，且不超过100MB</div>
    </el-upload>
      </el-form>
    </div>
    <el-row>
      <el-button type="primary" @click="submitlicen">提交审核</el-button>
    </el-row>
  </div>
</template>

<script>
export default {
  data() {
    return {
      proForm: {},
      houseForm: {},
      filesForm: {},
    };
  },
  methods: {
    queryLid() {
      this.$axios
        .get("presell-serv/Licences/queryLid/" + this.proForm.proposerId)
        .then((res) => {
          if (res.data.code == 200) {
            this.filesForm = res.data.data.licence;
          } else {
            this.$message.error(res.data.message);
          }
        });
    },
    submitlicen() {
      this.$axios
        .post("presell-serv/Highers/add", {
          proForm: this.proForm,
          houseForm: this.houseForm,
          filesForm: this.filesForm,
        })
        .then((res) => {
          if (res.data.code == 200) {
            this.$router.push("/Examine");
          } else {
            this.$message.error(res.data.message);
          }
        });
    },
    handlePreview(file) {
                console.log(file);
                window.open( file.response.url);
            }
  },
  mounted() {
    if (this.$route.query.proposerName != null) {
      this.proForm.proposerName = this.$route.query.proposerName;
    }
    if (this.$route.query.proposerCard != null) {
      this.proForm.proposerCard = this.$route.query.proposerCard;
    }
    if (this.$route.query.proposerId != null) {
      this.proForm.proposerId = this.$route.query.proposerId;
      this.houseForm.proposerId = this.$route.query.proposerId;
    }
    this.queryLid();
  },
};
</script>
